<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<style>
			body{
				height: 2000px;
			}
			#d{
				height: 100px;
			}
			#d1{
				border: 1px red solid;
			background-color: #3399FF;
			height:50px;
			padding-left: 200px;
			padding-top: 20px;
			/*position: absolute;*/
			width: 1000px;
			}
		</style>
		<script type="text/javascript" src="../jq/jQuery-1.8.3.js" ></script>
		<script>
			$(function() {
			var len = $("#d1").offset().top+$("#d1").height();
			$(window).scroll(function() {
				var len1 = $(this).scrollTop();
				if(len1 >= len) {
					$("#d1").css({
						"position": "fixed",
						"top": "20px"
					});
				} else {
					$("#d1").css("position", "static");
				}
				});
		});
		</script>
	</head>
	<body>
		<div id="d"></div>
		<div id="d1">
	    <input type="text";"/>搜索
		</div>
	</body>
</html>
